<template>
	<view>
		<!-- 自定义导航栏 -->
		<view>
			<u-navbar :is-back="false" title="" :background="{backgroundColor:'#F8F8F8'}">
				<view class="custom-navbar">
					<view class="nav-left" @click="customBack">
						<u-icon name="arrow-left" color="#000000" size="34"></u-icon>
					</view>
					<view class="nav-center u-flex u-row-center u-col-center">
						<view class="u-line-1" style="max-width: 80%;">{{currentGroupDto.imGroup.groupName}}</view>
						<view v-if="currentGroupDto.imGroup.memberCounts!=undefined&&currentGroupDto.imGroup.groupType!=0">
							{{"("+currentGroupDto.imGroup.memberCounts+")"}}
						</view>
						<view v-if="currentGroupDto.groupUser.chatStatus==1">
							<u-icon v-show="currentGroupDto.groupUser.chatStatus==1" name="/static/image/chat/pinbi.png"
								color="#c0c4cc" size="28"></u-icon>
						</view>
					</view>
					<view class="nav-right  u-flex u-row-right u-col-center" @click="toGroupDetail">
						<view>
							<u-icon name="more-dot-fill" color="#000000" size="34"></u-icon>
						</view>
					</view>
				</view>
			</u-navbar>
		</view>
		<view style="position: fixed;z-index: 1000;width: 100%;"
			v-if="loadingmMore==false&&currentGroupDto.imGroup.showNoticeFlag==1&&currentGroupDto.imGroup.groupNotice!=null&&currentGroupDto.imGroup.groupNotice.length>0">
			<u-notice-bar padding="20rpx 24rpx" speed="180" type="success" :height="80"
			 :speed="180" 	close-icon @close="closeAdvFlag" 
			 :list="formatNotice()">
			</u-notice-bar>
		</view>
		<!-- 信息记录列表 test-border-->
		<view class="msg-container">
			<scroll-view :scroll-y="true" :scroll-x="false" class="msg-box-scroller  hidden-scroll-bar"
				:style="'height:'+(scrollViewHeight-safeBottomHeight)+'px'" :scroll-top="scrollTop" 
				:scroll-into-view="scrollIntoView"
				@scrolltoupper="$noClicks(loadMoreHistoryMsg)" 
				:scroll-anchoring="true" 
				:upper-threshold="20"
				@touchstart="hideDrawer">
				<view v-if="loadingmMore" style="width: 100%;" class="u-flex u-row-center u-col-center">
					<u-loading mode="flower" size="38"></u-loading>
				</view>
				<view v-if="messageList.length>0">
					<view style="width: 100%;" v-for="(msg,index) in messageList" :key="index">
						<message-item :item="msg" :id="'msg_'+msg.id" 
							 :groupType="currentGroupDto.imGroup.groupType"
							 @reloadMessage="reloadMessage" 
							 @revertMsg="revertMsg($event,index)"
							 @showUpdateMsg="showUpdateMsgPop($event,index)"
							 @handleAudio="handleAudio" @linkToFriend="linkToFriend">
						</message-item>
					</view>
				</view>
			</scroll-view>
		</view>
		<!-- 底部模块盒子 -->
		<view class="footer-container">
			<view class="input-box u-border-top">
				<view class="input-box-flex">
					<!-- 语音/键盘切换,H5不支持 -->
					<!-- #ifdef APP-PLUS -->
					<view>
						<image v-if="chatType === 'voice'" class="icon_img"
							:src="require('@/static/image/chat/voice/voice.png')" @click="switchChatType('keyboard')">
						</image>
						<image v-if="chatType === 'keyboard'" class="icon_img"
							:src="require('@/static/image/chat/keyboard.png')" @click="switchChatType('voice')">
						</image>
					</view>
					<!-- #endif -->
					<!-- 中间的输入框或者语音录入显示框 -->
					<view class="input-box-flex-grow">
						<view v-if="chatType === 'voice'" class="textArea-box">
							<!-- 混合信息-文件信息 -->
							<view v-if="fileRemarkObj.showFlag==true&&fileRemarkObj.fileInfo"
								style="width:100rpx;font-size: 28rpx;color:#fa3534">
								<text>[{{fileRemarkObj.tag}}]</text>
							</view>
							<!-- 输入框 :cursor="sendStr.length"-->
							<scroll-view :scroll-y="true" :scroll-x="false" class="inputScroll" :show-scrollbar="true">
								<textarea style="text-indent:5upx;" auto-height="true"
									placeholder-style="color:#DDDDDD;" :cursor-spacing="10" :confirm-hold="true"
									confirm-type="send" :show-confirm-bar="false" :focus="inputFocusFlag"
									:auto-focus="false" :hold-keyboard="true" @blur="onBlur" @focus="onInputFocus"
									@confirm="$noClicks(confirmSendText)" v-model="sendStr" 
									:maxlength="-1">
								</textarea>
							</scroll-view>
						</view>
						<!-- #ifdef APP-PLUS -->
						<!-- 语音输入区域 -->
						<view v-if="chatType === 'keyboard'" class="voice_title" @touchstart.stop.prevent="startVoice"
							@touchmove.stop.prevent="moveVoice" @touchend.stop="endVoice"
							@touchcancel.stop="cancelVoice" :style="{ background: recording ? '#c7c6c6' : '#FFFFFF' }">
							{{ voiceTitle }}
						</view>
						<!-- #endif -->
					</view>
					<!-- 表情抽屉入口-->
					<view>
						<image class="u-m-l-20" :src="require('@/static/image/chat/emoji.png')" @click="changeEmojiBox">
						</image>
					</view>
					<!-- 宫格抽屉打开入口 -->
					<view v-show="showPlus()">
						<image class="u-m-l-20" :src="require('@/static/image/chat/add.png')" @click="changeDrawer">
						</image>
					</view>
					<!-- 发送按钮 :这里安卓和ios的展现形式不一样,showSendBtn判断显隐 -->
					<view v-show="showSendBtn(1)" class="u-m-l-16" @touchend.prevent="$noClicks(sendText)">
						<u-button type="success" :custom-style="customSendBtnStyle">
							<text>发送</text>
						</u-button>
					</view>
				</view>
				<!-- 宫格抽屉 -->
				<view class="fun-box u-border-top" :class="{'show-fun-box':showFunBtn}">
					<u-grid :col="4" :border="false" @click="funGirdItemClick">
						<u-grid-item v-for="(item, index) in funList" :index="index" :key="index"
							:custom-style="{padding:'20rpx 0'}" bg-color="#f8f8f8">
							<view class="u-flex u-row-center u-col-center"
								style="background-color: #FFFFFF;width: 110rpx;height: 110rpx;border-radius: 30rpx;">
								<u-icon :name="item.icon" :size="60"></u-icon>
							</view>
							<view class="grid-text" style="font-size: 24rpx;">{{ item.title }}</view>
						</u-grid-item>
					</u-grid>
				</view>
				<!-- 表情抽屉 -->
				<view class="fun-box u-border-top" :class="{'show-fun-box':showEmojiBox}">
					<swiper class="emoji-swiper" :indicator-dots="false" :duration="50" :vertical="false">
						<swiper-item v-for="(item,index) in faceList" :key="index">
							<view v-for="(childrenItem, childrenIndex) in item" :key="childrenIndex"
								@tap="addEmoji(childrenItem,index)">
								<image v-if="index<6" class="emo-image" :src="emojiUrl + emojiMap[childrenItem]">
								</image>
								<image v-else class="face-img" :src="faceUrl + childrenItem + '@2x.png'">
								</image>
							</view>
						</swiper-item>
					</swiper>
					<view v-if="showEmojiBox" style="padding:0rpx 20rpx;position: absolute;bottom: 1rpx;right: 10rpx;
								width: 250rpx;height: 150rpx;z-index: 1000;opacity: 0.9;" class="u-flex u-row-right u-col-center">
						<view class="u-flex u-row-center u-col-center"
							style="border: 1px solid #f1f1f1;border-radius: 10rpx; background-color: #82848a;width: 100rpx;padding: 15rpx 20rpx;margin-right: 8rpx;">
							<view @click="delSendStr()" @longpress="clearSendStr()">
								<u-icon name="backspace" size="46" color="#ffffff"></u-icon>
							</view>
						</view>
						<view v-show="showSendBtn(2)">
							<u-button @click=" $noClicks(sendText)" :disabled="sendStr.length<1" type="success"
								:custom-style="{padding:'20rpx'}">发送
							</u-button>
						</view>
					</view>
				</view>
			</view>

			<!-- 录音动画 -->
			<!-- #ifdef APP-PLUS -->
			<view class="voice_an" v-if="recording">
				<view class="voice_an_icon">
					<view id="one" class="wave"></view>
					<view id="two" class="wave"></view>
					<view id="three" class="wave"></view>
					<view id="four" class="wave"></view>
					<view id="five" class="wave"></view>
					<view id="six" class="wave"></view>
					<view id="seven" class="wave"></view>
				</view>
				<view class="text">{{voiceIconText}}</view>
			</view>
			<!-- #endif -->
		</view>


		<u-popup mode="center" v-model="editMsgPoPShow" length="90%">
			<view class="content u-p-30">
				<view class="u-flex u-row-between u-col-center">
					<view style="width: 30%;">
						是否显示时间:
					</view>
					<view style="width: 70%;" class="u-flex u-row-right u-col-center">
						<view>
							<u-switch v-model="editMessage.showTimeFlag"></u-switch>
						</view>
					</view>
				</view>
				<view class="u-m-t-30 u-flex u-row-between u-col-center">
					<view style="width: 30%;">修改发送时间</view>
					<view style="width: 70%;">
						<u-input v-model="editMessage.formatTimeStr" :clearable="false" type="text" :border="true"
							input-align="right" />
					</view>
				</view>
				<view class="u-m-t-30 u-flex u-row-between u-col-center" 
						v-if="editMessage.contentType == messageApi.CONTENT_TYPE.TEXT_CONTENT_TYPE">
					<view style="width: 30%;">文本内容</view>
					<view  style="width: 70%;">
						<u-input v-model="editMessage.content.text"  :clearable="true"
						type="textarea" :border="true" input-align="left"/>
					</view>
				</view>
				<view class="u-m-t-30">
					<u-button type="success" @click="submitEdit()">确定</u-button>
				</view>
			</view>
		</u-popup>

	</view>
</template>
<script>
	import faceUtil from "@/util/emojiMap.js"; //表情
	import permission from '@/common/mobilePermission/permission.js'; //手机权限
	import messageItem from "@/components/message-item/message-item.vue"; //聊天信息
	const messageScrollScale=0.831;
	const TIME_THRESHOLD=60000*10;//信息显示间隔时间 10分钟就显示
	export default {
		components: {
			messageItem
		},
		data() {
			return {
				windowHeight: 0, //页面高度
				safeBottomHeight:0,
				scrollViewHeight: 0, //信息列表的高度
				currentGroupDto: { //当前群聊信息
					imGroup: {}, //基本信息
					groupUser: {}, //用户设置信息
				},
				chatGroupId: "", //当前群ID
				loadingmMore: false, //是否加载更多
				scrollTop: 0,
				scrollIntoView: '', //信息列表滚动的为准
				scrollAnimation: false, //列表滚动动画
				chatType: 'voice', // 图标类型 'voice'语音 'keyboard'键盘
				inputFocusFlag: false, //输入框是否获取到焦点
				fileRemarkObj: { //文件+文字描述混合信息中的文件信息
					showFlag: false,
					tag: "图片",
					fileInfo: null,
				},
				sendTimeBetween: 60, //发送信息显示的间隔，60秒以内信息不显示发送时间
				sendStr: '', //输入框字符串
				customSendBtnStyle: { //发送按钮的自定义样式
					padding: '10rpx 20rpx',
				},
				showFunBtn: false, //是否展示宫格功能抽屉的开关
				showEmojiBox: false, //是否显示表情抽屉弹窗的开关
				//宫格功能菜单
				funList: [{
						id: 1,
						icon: "photo-fill",
						title: "照片",
						uploadType: ["album"]
					},
					{
						id: 2,
						icon: "camera-fill",
						title: "拍摄",
						uploadType: ["camera"]
					},
					{
						id: 5,
						icon: "/static/image/chat/video.png",
						title: "视频通话",
					},
					{
						id: 6,
						icon: "map-fill",
						title: "位置",
					},
					{
						id: 3,
						icon: "red-packet-fill",
						title: "红包",
					},
					{
						id: 4,
						icon: "/static/image/chat/gird/zhuanzhang.png",
						title: "转账",
					},
					{
						id: 8,
						icon: "/static/image/chat/gird/voiceInput.png",
						title: "语音输入",
					},
					{
						id: 7,
						icon: "/static/image/chat/gird/collcetion.png",
						title: "收藏",
					}
				],
				emojiUrl: faceUtil.emojiUrl, //表情请求前缀（腾讯）
				emojiMap: faceUtil.emojiMap, //表情包集合（腾讯）
				emojiName: faceUtil.emojiName, //表情名称（腾讯）
				faceUrl: faceUtil.faceUrl, //特殊表情请求前缀（腾讯）
				bigEmojiList: faceUtil.bigEmojiList, //特殊表情对象集合（腾讯）
				faceList: [], //自定义表情对象集合，有腾讯数据提供转换而来
				pageNum: 1, //信息记录加载页码
				pageSize: 15, //每页展示条数
				messageList: [], //信息列表
				nextPageFlag: true, //是否存在下一页数据
				//H5不支持==========发送语音信息相关，start=====================
				Recorder: null, //获取全局唯一的录音管理器
				Audio: null, //音频对象
				recording: false, //标识是否正在录音
				isStopVoice: false, //加锁 防止点击过快引起的当录音正在准备(还没有开始录音)的时候,却调用了stop方法但并不能阻止录音的问题
				voiceInterval: null, //录音定时器
				voiceTime: 0, //总共录音时长
				voiceCanSend: true, //是否可以发送
				PointY: 0, //录音上划取消坐标位置
				voiceIconText: "正在录音...", //录音动作提示语
				voiceTitle: '按住 说话',
				AudioExam: null, //正在播放音频的实例		
				//=============语音录音信息相关 end======================
				noClick: true, //防止重复点击发送
				editMsgPoPShow: false, //信息编辑弹窗控制开关
				editMessage: { //当前编辑的信息
					showTimeFlag: '0',
					formatTimeStr: '',
				},
			};
		},
		created: function() {
			if(this.vuex_OSPlat=='ios'){
				let safeAreaBottom= uni.getSystemInfoSync().safeArea.bottom;
				let safeAreaHeight= uni.getSystemInfoSync().safeArea.height;
				this.safeBottomHeight=safeAreaBottom-safeAreaHeight; //计算底部安全区域的位置
			}
			//计算页面高度布局
			this.windowHeight = this.$u.sys().windowHeight; //H5原始高度，H5键盘收起时会用到
			let scrollViewHeight = this.$u.sys().windowHeight * messageScrollScale;
			this.scrollViewHeight = scrollViewHeight;
			this.scrollTop = scrollViewHeight;// - 5
			//表情初始化
			let emjiList = faceUtil.splitEmojiList();
			//这里注释掉不需要的表情，如果放开出来前缀不一样会带来界面适配的问题，后续在处理
			/* for (let i = 0; i < this.bigEmojiList.length; i++) {
			  emjiList.push(this.bigEmojiList[i].list);
			} */
			this.faceList = emjiList;
			//console.log("faceList",this.faceList);
		},
		watch: {
			//监听H5键盘是否拉起的高度
			inputFocusFlag: function(inputFocus) {
				let that = this;
				// #ifdef H5
				console.log("输入框焦点变化", inputFocus);
				if (inputFocus == true) {
					that.showFunBtn = false;
					that.showEmojiBox = false;
					that.scrollViewHeight = that.$u.sys().windowHeight * 0.48;
					console.log("H5键盘打开", that.scrollViewHeight);
				} else {
					uni.hideKeyboard();
					if (!(that.showEmojiBox || that.showFunBtn)) {
						let scrollViewHeight = this.windowHeight * messageScrollScale;
						that.scrollViewHeight = scrollViewHeight;
						console.log("H5键盘收起", that.scrollViewHeight);
					}
				}
				// #endif
			},
			/* 			
				监听列表高度变化需要做的处理，主要发生在键盘弹出，表情抽屉，和功能抽屉
				监听到列表高度变化，保证最后一条信息不被键盘或者抽屉弹窗挡住
			*/
			scrollViewHeight(newVal, oldVal) {
				let that = this;
				//console.log("监听到列表高度变化，保证最后一条信息不被键盘或者抽屉弹窗挡住");
				if (that.messageList.length > 2) {
					that.scrollIntoView = "msg_" + that.messageList[that.messageList.length - 2].id;
					that.scrollAnimation = false;
					setTimeout(function() {
						that.scrollAnimation = true;
						that.scrollIntoView = "msg_" + that.messageList[that.messageList.length - 1].id;
					}, 500);
				}
			},
			
			messageList(){
				this.displayMessagesTime();
			}
		},

		//监听键盘弹起隐藏
		onReady() {
			let that = this;
			// 官方api【onKeyboardHeightChange】仅支持APP平台，H5不支持此监听
			// #ifdef APP-PLUS
			uni.onKeyboardHeightChange(res => {
				//console.log("监听到键盘高度变化",res);
				//如果键盘弹起
				if (res.height != 0) {
					that.showFunBtn = false;
					that.showEmojiBox = false;
					that.scrollViewHeight = (that.$u.sys().windowHeight - res.height) * 0.735;
				}
				//键盘收起
				else {
					if (!(that.showEmojiBox || that.showFunBtn)) {
						that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
					}
				}
			});
			// #endif
		},
		onHide: function() {
			let that = this;
			// #ifdef APP-PLUS
			if (that.Audio) {
				that.Audio.stop();
			}
			// #endif
		},
		onUnload: function() {
			let that = this;
			// #ifdef APP-PLUS
			if (that.Audio) {
				that.Audio.stop();
			}
			// #endif
			//重置当前群聊ID,很重要,因为全局在监听
			that.currentGroupDto.groupUser.readTime=that.globalUtil.getTimeStr(new Date().getTime());
			that.currentGroupDto.groupUser.hiddenFlag=0;
			that.currentGroupDto.groupUser.showOptionFlag=false;
			that.localGroupApi.updateMyGroupSetInfo(that.currentGroupDto,that,(res)=>{
				console.log("退出更新群组的已读时间",res);
			});
			this.$u.vuex("vuex_currentChatGroupId", "");
		},
		onLoad: function(option) {
			let that = this;
			let chatGroupId = option.chatGroupId;
			this.chatGroupId = chatGroupId;
			//赋值vuex变量，为了在APP.vue全局监听到当前群组的信息
			this.$u.vuex("vuex_currentChatGroupId", chatGroupId);
			//获取聊天信息
			that.getChatGroupInfo(true);
			//实时监听后端socket信息.
			uni.$on("pushMessage", function(newMessage) {
				//渲染到信息列表
				that.onScoketMessage(newMessage);
			});
			uni.$on("chattinGroupListener", function(flag) {
				that.getChatGroupInfo(flag);
			});
			//录音器，getRecorderManager不支持H5
			// #ifdef APP-PLUS
			//获取全局唯一的录音管理器（https://uniapp.dcloud.net.cn/api/media/record-manager.html#getrecordermanager）
			that.Recorder = uni.getRecorderManager();
			//创建并返回内部 Audio对象。(https://uniapp.dcloud.net.cn/api/media/audio-context.html#createinneraudiocontext)
			that.Audio = uni.createInnerAudioContext(); //音频
			//录音开始事件
			that.Recorder.onStart(e => {
				that.beginVoice();
			});
			//录音结束事件
			that.Recorder.onStop(res => {
				clearInterval(that.voiceInterval);
				that.handleRecorder(res);
			});
			//音频停止事件
			that.Audio.onStop(e => {
				that.closeAnmition();
			});
			//音频播放结束事件
			that.Audio.onEnded(e => {
				that.closeAnmition();
			});
			// #endif
		},

		//监听返回
		onBackPress(options) {
			this.customBack();
			return true;
		},

		methods: {
			//自定义返回逻辑
			customBack: function() {
				let that = this;
				// #ifdef APP-PLUS
				if (that.Audio) {
					that.Audio.stop();
				}
				// #endif
				uni.hideKeyboard();
				//隐藏功能抽屉或者表情抽屉
				that.hideDrawer();
				setTimeout(function() {
					uni.switchTab({
						url: "/pages/tabbar/group/group"
					})
				}, 200)
			},
			//跳转群组详情
			toGroupDetail: function() {
				console.log("跳转详情");
				let that = this;
				let groupType=that.currentGroupDto.imGroup.groupType;
				let param = {
					chatGroupId: that.currentGroupDto.imGroup.groupId,
					chatGroupType:groupType
				};
				that.$u.route({
					url: '/pages/tabbar/group/chat/chatDetail',
					params: param
				});
				return;
			},
			//跳转朋友信息界面
			linkToFriend() {
				let that = this;
				let group = that.currentGroupDto.imGroup;
				let groupType = group.groupType;
				//如果是点对点的
				if (groupType == 0) {
					this.$u.route({
						url: '/pages/tabbar/contact/friends/friend-home',
						params: {
							friendId: group.friendUserId
						},
					})
				}
				//如果是多人群组聊天
				else {

				}
			},
			//获取群组信息
			getChatGroupInfo: function(historyMsgLoadFlag) {
				let that = this;
				let param = {
					chatGroupId: that.chatGroupId
				};
				that.$u.api.chatGroup.getChatGroupInfo(param).then(res => {
					if (res.code == 200) {
						let data = res.data;
						that.currentGroupDto = data;
						console.log("======当前群组信息=========", that.currentGroupDto);
						//获取当前群聊的本地历史信息记录
						if (historyMsgLoadFlag) {
							that.getHistoryMessageList();
						}
					} else {
						that.globalUtil.utilAlert("群信息获取失败");
						return;
					}
				})
			},
			/**
			 *  //加载本地历史信息记录
			 *	//这里是否需要从后端获取，取决于个人信息存储机制需求，
			 *  //可以存本地缓存，或者存后端redis、mysql等数据库中
			 */
			getHistoryMessageList: function() {
				let that = this;
				let param = {
					groupId: that.chatGroupId,
					pageNum: 1,
					pageSize: that.pageSize
				};
				that.$u.api.groupMessage.getMessageListByChatGroupId(param).then(res => {
					//console.log("res.data",res.data);
					console.log("从[***服务端***]获取群组ID[" + that.chatGroupId + "]的聊天记录-----共计:("+res.data.length+")条");
					if (res.code == 200) {
						let messageList = res.data;
						if(messageList!=null&&messageList.length>0){
							messageList.map(function(item,index){
								if(item.userId==that.vuex_userInfo.id){
									item.meFlag=true;
								}else{
									item.meFlag=false;
								}
							})
							that.messageList = messageList.reverse();
							let scrollViewId = messageList[messageList.length - 1].id;
							setTimeout(function(){
								that.$nextTick(function(){
									that.scrollIntoView = "msg_" + scrollViewId;
								})
							},300)
						}else{
							that.messageList=[];
						}
					}
				});
			},

			//分页加载更多历史信息
			loadMoreHistoryMsg: function() {
				let that = this;
				if (that.nextPageFlag == false||that.pageNum>10||that.messageList.length<1) {
					return;
				}
				if(that.loadingmMore){
					setTimeout(function(){
						if(that.loadingmMore){
							that.loadingmMore=false
						}	
					},5000);
					return;
				};
				that.loadingmMore = true;
				that.pageNum = that.pageNum + 1;
				let param = {
					groupId: that.chatGroupId,
					pageNum: that.pageNum,
					pageSize:that.pageSize
				};
				console.log("加载第"+that.pageNum+"页记录结果");
				let oldScrollViewId = that.messageList.length>0?that.messageList[0].id:null;
				that.$u.api.groupMessage.getMessageListByChatGroupId(param).then(res => {
					if (res.code == 200) {
						let messageList = res.data;
						if(messageList&&messageList.length>0){
							let moreData = messageList.reverse();
							that.messageList = moreData.concat(that.messageList);
							setTimeout(function() {
								if(oldScrollViewId){
									that.scrollIntoView = "msg_" + oldScrollViewId;
								}
								that.loadingmMore = false;
								that.$forceUpdate();
							}, 500)
							return;
						}
					}
					console.log("暂无更历史信息")
					that.loadingmMore = false;
					that.nextPageFlag = false;
					that.pageNum--;
					return;
				}).catch(error=>{
					console.log("error",error);
					that.loadingmMore = false;
					that.pageNum--;
				});	
			},

			//处理信息时间是否展示
			displayMessagesTime() {
			  console.log("处理信息间隔显示");
			  let that=this;
			  if(that.messageList.length<1){
				  return;
			  }
			  let lastTimestamp = null;
			  that.messageList.forEach((msg, index) => {
			    const currentTime = msg.timestamp;
			    // 判断是否需要显示时间戳
			    if (lastTimestamp === null || currentTime - lastTimestamp > TIME_THRESHOLD) {
					  msg.showTimeFlag=true;
					  lastTimestamp = currentTime;
			    } else {
					 msg.showTimeFlag=false;
			    }
			  });
			},

			//是否显示发送按钮
			showSendBtn(position) {
				// #ifdef APP-PLUS
				let os = uni.getSystemInfoSync().platform;
				if (os == 'ios') {
					if (position == 2) {
						return true;
					}
					return false;
				}
				if (os == "android" && this.sendStr.length > 0) {
					if (position == 1) {
						return true;
					} else {
						return false;
					}
				} else {
					return false;
				}
				// #endif
				// #ifndef APP-PLUS
				return true
				// #endif

			},
			//是否显示加号
			showPlus() {
				// #ifdef APP-PLUS
				let os = uni.getSystemInfoSync().platform;
				if (os == 'ios') {
					return true;
				}
				if (os == "android" && this.sendStr.length > 0) {
					return false;
				} else {
					return true;
				}
				// #endif
				// #ifndef APP-PLUS
				return true
				// #endif
			},
			//切换语音或者键盘方式
			switchChatType(type) {
				let that = this;
				that.chatType = type;
				//底部菜单隐藏
				if (this.showFunBtn == true) {
					this.showFunBtn = false;
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
				//表情弹窗
				if (this.showEmojiBox == true) {
					this.showEmojiBox = false;
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
				if (type == "voice") {
					this.inputFocusFlag = true;
				} else {
					if (uni.getSystemInfoSync().platform == "android") {
						permission.requestAndroid("android.permission.RECORD_AUDIO"); //Android请求录音权限
					} else {
						permission.requestIOS("record"); //ios请求录音权限
					}
				}
			},
			//选中了表情
			addEmoji: function(emojiItem, index) {
				let that = this;
				//console.log("emojiItem",emojiItem);
				//console.log("emojiItemIndex",index);
				that.sendStr += emojiItem;
			},
			//表情替换
			replaceEmoji(str) {
				let that = this;
				let replacedStr = str.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
					for (let i = 0; i < this.faceList.length; i++) {
						let row = this.faceList[i];
						for (let j = 0; j < row.length; j++) {
							let EM = row[j];
							if (EM == item) {
								let imgstr = "face" + EM;
								return imgstr;
							}
						}
					}
				});
				//console.log("replacedStr", replacedStr);
				return replacedStr;
			},
			//删除表情和文字
			delSendStr: function() {
				//console.log("删除表情",this.sendStr);
				let emojiStr = this.sendStr;
				let emojiArr = [];
				emojiStr = emojiStr.replace(/\[([^(\]|\[)]*)\]/g, function(item, index) {
					emojiArr.unshift(item);
				});
				if (emojiArr.length > 0) {
					if (this.sendStr.endsWith(emojiArr[0])) {
						this.sendStr = this.sendStr.replace(emojiArr[0], "");
					} else {
						this.sendStr = this.sendStr.slice(0, this.sendStr.length - 1);
					}
				} else {
					this.sendStr = this.sendStr.slice(0, this.sendStr.length - 1);
				}
			},
			//清除文本
			clearSendStr: function() {
				console.log("长按删除")
				this.sendStr = "";
			},
			//隐藏功能或者表情抽屉盒子
			hideDrawer: function() {
				let that = this;
				if (this.showFunBtn == true) {
					uni.hideKeyboard();
					this.showFunBtn = false;
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
				if (this.showEmojiBox == true) {
					uni.hideKeyboard();
					this.showEmojiBox = false;
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
			},
			//输入框获取到焦点事件
			onInputFocus: function(event) {
				//console.log("输入框获取到焦点",event);
				this.inputFocusFlag = true;
			},
			//输入框失去焦点事件
			onBlur: function(event) {
				let that = this;
				let text = event.target.value;
				//console.log("输入框失去焦点", text);
				that.inputFocusFlag = false;
				if (text.length < 1 && that.fileRemarkObj.showFlag) {
					uni.showModal({
						title: '是否清除附件',
						success: function(res) {
							if (res.confirm) {
								that.fileRemarkObj.showFlag = false;
								that.fileRemarkObj.fileInfo = null;
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				}
			},
			//键盘确认发送
			confirmSendText: function(e) {
				let that = this;
				that.sendText();
			},
			//发送文字
			sendText: function() {
				let that = this;
				if (that.sendStr.length < 1) {
					uni.hideKeyboard();
					that.globalUtil.utilAlert("不能发送空字符串");
					return;
				} else {
					//如果文字中有表情,需要转换处理
					let formatStr = this.replaceEmoji(this.sendStr);
					let content = {
						"text": formatStr, //文本内容
					};
					//判断是不是图文结合的
					let showFlag = this.fileRemarkObj.showFlag;
					let fileInfo = this.fileRemarkObj.fileInfo;
					if (showFlag && fileInfo) {
						console.log("发送组合信息类型", fileInfo);
						that.sendComponentMsg(formatStr);
						return;
					} else {
						console.log("发送文本信息");
						that.sendMsg(this.messageApi.MSG_TYPE.USER_MSG,
							this.messageApi.CONTENT_TYPE.TEXT_CONTENT_TYPE,
							content);
					}
				}
			},
			//重置复合信息
			resetComponentInfo: function() {
				let that = this;
				that.fileRemarkObj.fileInfo = null;
				that.fileRemarkObj.showFlag = false;
				that.fileRemarkObj.tag = "";
			},
			//发送图文或者视频图文的信息
			sendComponentMsg: function(textDesc) {
				let that = this;
				let tag = that.fileRemarkObj.tag;
				let fileInfo = that.fileRemarkObj.fileInfo;
				let tempFilePath = fileInfo.tempFilePath;
				if (tempFilePath == null || tempFilePath == undefined || tempFilePath.length < 1) {
					that.resetComponentInfo();
					return;
				}
				that.resetComponentInfo();
				that.sendStr = "";
				uni.hideKeyboard();
				uni.showLoading({
					mask: true,
					title: '发送中',
				})
				fileInfo.textDesc = textDesc;
				if (tag == "图片") {
					that.uploadFile(fileInfo, 11);
					return
				}
				if (tag == "视频") {
					that.uploadFile(fileInfo, 12);
					return;
				}
			},
			//控制表情弹窗
			changeEmojiBox: function() {
				let that = this;
				that.showFunBtn = false; //关闭功能盒子
				that.showEmojiBox = !that.showEmojiBox; //控制表情弹窗
				uni.hideKeyboard(); //隐藏键盘
				//这里要根据是否打开表情弹窗控制聊天列表盒子的高度
				if (that.showEmojiBox) {
					that.chatType = "voice";
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale - 200;
				} else {
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
			},
			//切换功能性按钮
			changeDrawer() {
				let that = this;
				that.showEmojiBox = false;
				that.showFunBtn = !that.showFunBtn;
				uni.hideKeyboard();
				if (that.showFunBtn) {
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale - 200;
				} else {
					that.scrollViewHeight = that.$u.sys().windowHeight * messageScrollScale;
				}
			},
			//功能弹窗点击事件
			funGirdItemClick: function(index) {
				let that = this;
				if (!that.vuex_WSObj) {
					that.globalUtil.utilAlert("网路故障，服务不可达");
					return;
				}
				let id = that.funList[index].id;
				that.inputFocusFlag = false;
				that.fileRemarkObj.showFlag = false;
				that.fileRemarkObj.fileInfo = null;
				that.fileRemarkObj.tag = "";
				switch (id) {
					case 1:
						that.chooseImage(that.messageApi.CONTENT_TYPE.IMG_CONTENT_TYPE); //选择照片
						break;
					case 2:
						that.chooseVideo(that.messageApi.CONTENT_TYPE.VIDEO_CONTENT_TYPE); //选择视频
						break;
					case 3:
						that.toSendRedBag(); //发送红包
						break;
					case 4:
						that.toTransfer(); //转账
						break;
					case 5:
						that.launchSingleCalling(2);//视频通话
						break;
					case 8:
						that.launchSingleCalling(1);//音频通话
						break;	
					default:
						that.globalUtil.utilAlert("暂未开放,敬请期待");
						break;
				}
				return;
			},

			//单聊发起音视频通话  type 1:语音通话 2视频通话
			launchSingleCalling: function(type) {
				console.log("发起音视频通话",type);
				let that = this;
				let remoteUserIds = [];
				let param = {
					chatGroupId:that.chatGroupId
				};
				that.$u.api.chatGroup.getChatGroupTrcMembers(param).then(res => {
					console.log("发起音视频通话获取成员结果",res);
					if (res.code == 200) {
						let groupMemberList = res.data;
						if (groupMemberList.length > 0) {
							for (let i = 0; i < groupMemberList.length; i++) {
								let trcUserId = groupMemberList[i].trcRemoteUserId;
								remoteUserIds.push(trcUserId);
							}
						}
						console.log("remoteUserIds", remoteUserIds);
						let callResult= this.trcApi.singleCall(remoteUserIds[0],type);
						console.log("callResult", callResult);
						let content={
							callStatus:'start'
						};
						let timestamp = new Date().getTime();
						let message = {
							"id": new Date().getTime() + "",
							"chatGroupId": that.chatGroupId,
							"userId": that.vuex_userInfo.id,
							"meFlag": true,
							"userName": that.vuex_userInfo.userName,
							"userAvatar": that.vuex_userInfo.avatar ? that.vuex_userInfo.avatar :
								"/static/image/default/default-user/default-user.png",
							'messageType':this.messageApi.MSG_TYPE.USER_MSG,
							"contentType": type,
							"content": content,
							"createTime": that.globalUtil.getTimeStr(timestamp),
							"timestamp": timestamp,
							"platFrom": 1,
							"showTimeFlag": true,
						}
						that.globalWX.sendMessage(message, {
							complete: function(res) {
								console.log("=======已发送==========", res);
								if (res == true) {
									return true;
								} else {
									that.globalUtil.utilAlert("网络故障，稍后重试！");
									return false;
								}
							}
						},that.messageApi.BUSINESS_CODE.Calling);
						that.trcApi.listenCallStatus({
							onError:function(res){
								console.log(res);
							},
							onCallReceived:function(res){
								console.log(res);
							},
							onCallCancelled:function(res){
								console.log(res);
							},
							onCallBegin:function(res){
								console.log(res);
							},
							onCallEnd:function(res){
								console.log(res);
							},
						});
					} else {
						that.globalUtil.utilAlert("音视频通话远程用户信息获取失败");
						return;
					}
				})
			},

			onCallEnd: function(res) {
				let that = this;
				let result = "";
				let callRole = "";
				if (that.platos == "ios") {
					result = res.data;
					callRole = result[3];
				} else {
					result = res;
					callRole = res.callRole;
				}
				if (callRole == 0) {
					let param = {
						roomID: '',
						type: '1', //1是音频 2是视频
						totalTime: 0, //通话时长
						targetUserID: '', //对方userId
						fromUserId: '',
						callRole: 0, //0 是主叫 1被叫
					}
					if (that.platos == "ios") {
						param.totalTime = result[4];
						param.callRole = result[3];
						param.type = result[2];
						param.roomID = result[1];
						param.targetUserID = result[0][0];
						param.fromUserId = that.vuex_userInfo.id;
					} else {
						param.totalTime = result.totalTime;
						param.callRole = result.callRole;
						param.type = result.type;
						param.roomID = result.roomID;
						param.targetUserID = result.userIDs[0];
						param.fromUserId = that.vuex_userInfo.id;
					}
					console.log("音视频通话记录保存", param);
					that.videoMsgFlag = false;
					let videoMsgTimmer = setTimeout(function() {
						that.videoMsgFlag = true;
						clearTimeout(videoMsgTimmer);
					}, 3000);
					//that.sendMsg(1, 13, param);
				}
			},
			
			
			//去发红包
			toSendRedBag: function() {
				let that = this;
				let chatGroupType = that.currentGroupDto.imGroup.groupType;
				let chatGroupId = that.currentGroupDto.imGroup.groupId;
				console.log("chatGroupType", chatGroupType);
				if (chatGroupType == 0) {
					this.$u.route({
						url: '/pages/tabbar/group/chat/redbag/redbag',
						params: {
							chatGroupId: chatGroupId,
							targetUserName: that.currentGroupDto.imGroup.groupName,
							targetUserAvatar: that.currentGroupDto.imGroup.groupAvatar,
							targetUserId: that.currentGroupDto.imGroup.friendUserId,
						},
						animationType: 'slide-in-bottom'
					})
				} else {
					let userLevel = this.vuex_userInfo.level;
					if (userLevel > 0) {
						console.log("自定义红包值");
						this.$u.route({
							url: '/pages/tabbar/group/chat/redbag/custom-redbag-for-group',
							params: {
								currentChatGroup: JSON.stringify(that.currentGroupDto)
							},
							animationType: 'slide-in-bottom'
						})
					} else {
						this.$u.route({
							url: '/pages/tabbar/group/chat/redbag/redbagForGroup',
							params: {
								currentChatGroup: JSON.stringify(that.currentGroupDto)
							},
							animationType: 'slide-in-bottom'
						})
					}
				}
				return;
			},
			//跳转转账
			toTransfer: function() {
				let that = this;
				let chatGroupType = that.currentGroupDto.imGroup.groupType;
				let chatGroupId = that.currentGroupDto.imGroup.groupId;
				//点对点转账
				if (chatGroupType == 0) {
					this.$u.route({
						url: '/pages/tabbar/group/chat/transfer/transfer',
						params: {
							chatGroupId: chatGroupId,
							targetUserName: that.currentGroupDto.imGroup.groupName,
							targetUserAvatar: that.currentGroupDto.imGroup.groupAvatar,
							targetUserId: that.currentGroupDto.imGroup.friendUserId,
						},
						animationType: 'slide-in-bottom'
					})
				} else {
					that.globalUtil.utilAlert("多人群聊暂不支持此项");
					return;
				}
			},

			//选择视频或者 拍摄视频
			chooseVideo(contentType) {
				let that = this;
				uni.chooseVideo({
					sourceType: ['camera', 'album'],
					compressed: false,
					success: function(res) {
						delete res.errMsg;
						let video = {
							width: res.width,
							height: res.height,
							tempFilePath: res.tempFilePath
						};
						//console.log("选择的视频",video);
						let tempFilePath = res.tempFilePath;
						if (!tempFilePath) {
							that.globalUtil.utilAlert("失败!");
							return;
						}
						let maxW = uni.upx2px(350); //350是定义消息图片最大宽度
						let maxH = uni.upx2px(350); //350是定义消息图片最大高度
						if (video.width > maxW || video.height > maxH) {
							let scale = video.width / video.height;
							video.width = scale > 1 ? maxW : maxH * scale;
							video.height = scale > 1 ? maxW / scale : maxH;
						}
						//获取视频第一帧
						// #ifdef APP-PLUS
						let target = that.$u.api.multipartAddress.target;
						if (target == "local") {
							that.globalUtil.getVideoImage(that, tempFilePath, {
								complete: function(res) {
									console.log("本地上传视频获取第一帧结果", res);
									if (res) {
										video.screenShot = res;
									}
								}
							});
						}
						// #endif
						uni.showModal({
							title: '是否立即发送?',
							confirmText: '立即发送',
							cancelText: '视频图文发送',
							success: function(res) {
								if (res.confirm) {
									console.log('用户点击确定');
									uni.showLoading({
										title: '视频处理中',
										mask: true
									});
									that.uploadFile(video, contentType);
								} else if (res.cancel) {
									that.fileRemarkObj.showFlag = true;
									that.fileRemarkObj.fileInfo = video;
									that.fileRemarkObj.tag = "视频";
									that.inputFocusFlag = true;
								}
							}
						});
					}
				});
			},
			//从相册或者拍照发送图片
			chooseImage(contentType) {
				let that = this;
				uni.chooseImage({
					count: 9,
					sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
					success:(res) => {
						let tempFilePathArr=res.tempFilePaths;
						//单张发送
						if(tempFilePathArr.length==1){
							let imgPath=tempFilePathArr[0];
							uni.getImageInfo({
								src:imgPath,
								success: (image) => {
									let imageObj={
										tempFilePath:image.path
									}
									let maxW = uni.upx2px(350); //350是定义消息图片最大宽度
									let maxH = uni.upx2px(350); //350是定义消息图片最大高度
									if (image.width > maxW || image.height > maxH) {
										let scale = image.width / image.height;
										imageObj.width = scale > 1 ? maxW : maxH * scale;
										imageObj.height = scale > 1 ? maxW / scale : maxH;
									}
									uni.showModal({
										title: '是否立即发送?',
										confirmText: '立即发送',
										cancelText: '图文发送',
										success: function(res) {
											if (res.confirm) {
												that.uploadFile(imageObj,contentType);
												return;
											} else if (res.cancel) {
												that.fileRemarkObj.showFlag = true;
												that.fileRemarkObj.fileInfo =imageObj;
												that.fileRemarkObj.tag = "图片";
												that.inputFocusFlag = true;
												return;
											}
										}
									});
								}
							});
							return;
						}
						//多张发送
						else{
							that.globalUtil.utilLoading("正在发送");
							that.uploadMuchFile(0,tempFilePathArr,contentType);
						}
					},
					fail() {
						console.log("选择图片上传发送异常");
					}
				});
			},
			//上传文件 contentType 2图片 3视频 4语音 5文件
			uploadFile: function(tempFileInfo, contentType) {
				let that = this;
				if (tempFileInfo.errMsg) {
					delete tempFileInfo.errMsg;
				};
				that.globalUtil.globalUpload(that,{
					param:{
						filePath:tempFileInfo.tempFilePath,
						savePath:"chattingFiles"  //文件存放目录
					},
					success: (uploadResult) => {
						console.log("文件上传完成",uploadResult);
						let fileInfo =uploadResult.result;
						let fileMsgObj = Object.assign(tempFileInfo, fileInfo);
						console.log("发送文件信息参数", fileMsgObj);
						let sendFlag= that.sendMsg(that.messageApi.MSG_TYPE.USER_MSG,contentType,fileMsgObj);
						console.log("文件信息发送结果",sendFlag);
						uni.hideLoading();
					},
					fail:(res1) => {
						that.globalUtil.utilAlert("文件上传发送失败");
						uni.hideLoading();
					}
				});
			},
			//批量发送多张图片
			uploadMuchFile(index=0,tempFilePaths,contentType) {
				let that=this;
				let size= tempFilePaths.length;
				if(index==size){
					console.log("文件全部上传完成");
					uni.hideLoading();
					return;
				}
				let tempPath=tempFilePaths[index];
				uni.getImageInfo({
					src:tempPath,
					success: (image) => {
						let imageObj={
							tempFilePath:image.path
						}
						let maxW = uni.upx2px(350); //350是定义消息图片最大宽度
						let maxH = uni.upx2px(350); //350是定义消息图片最大高度
						if (image.width > maxW || image.height > maxH) {
							let scale = image.width / image.height;
							imageObj.width = scale > 1 ? maxW : maxH * scale;
							imageObj.height = scale > 1 ? maxW / scale : maxH;
						}
						that.globalUtil.globalUpload(that,{
							param:{
								filePath:imageObj.tempFilePath,
								savePath:"chattingFiles"  //文件存放目录
							},
							success: (uploadResult) => {
								console.log("第"+(index+1)+"个文件上传完成",uploadResult);
								let fileInfo =uploadResult.result;
								let fileMsgObj = Object.assign(imageObj, fileInfo);
								console.log("发送文件信息参数", fileMsgObj);
								let sendFlag= that.sendMsg(that.messageApi.MSG_TYPE.USER_MSG,contentType,fileMsgObj);
								console.log("文件信息发送结果",sendFlag);
								//下标加1，继续上传发送文件
								setTimeout(function(){
									index++;
									that.uploadMuchFile(index,tempFilePaths,contentType);
								})
							},
							fail:(res1) => {
								that.globalUtil.utilAlert("第"+(index+1)+"份文件上传发送失败");
								index++;
								that.uploadMuchFile(index,tempFilePaths,contentType);
							}
						});
					}
				});
			},
			
			//发送信息
			//msgType ：2用户信息 1系统信息
			//contentObj：信息内容 json对象
			//contentType：内容类型 1文本
			sendMsg: function(msgType, contentType, contentObj) {
				let that = this;
				let timestamp = new Date().getTime();
				let showTimeFlag = false;
				let message = {
					"id": new Date().getTime() + "",
					"chatGroupId": that.chatGroupId,
					"userId": that.vuex_userInfo.id,
					"meFlag": true,
					"userName": that.vuex_userInfo.userName,
					"userAvatar": that.vuex_userInfo.avatar ? that.vuex_userInfo.avatar :
						"/static/image/default/default-user/default-user.png",
					'messageType': msgType,
					"contentType": contentType,
					"content": contentObj,
					"createTime": that.globalUtil.getTimeStr(timestamp),
					"timestamp": timestamp,
					"platFrom": 1,
					"showTimeFlag": showTimeFlag,
				}
				console.log("发送信息", message);
				/*发送信息到后端*/
				that.globalWX.sendMessage(message, {
					complete: function(res) {
						console.log("=======已发送==========", res);
						if (res == true) {
							return true;
						} else {
							that.globalUtil.utilAlert("网络故障，稍后重试！");
							return false;
						}
					}
				},that.messageApi.BUSINESS_CODE.chatting);
			},

			//监听后端推送过来的socket信息
			onScoketMessage: function(messageObj) {
				let that = this;
				if (that.vuex_currentChatGroupId == that.chatGroupId) {
					if (messageObj.userId == that.vuex_userInfo.id) {
						messageObj.meFlag = true;
						that.sendStr = "";
					} else {
						messageObj.meFlag = false;
					}
					let messageType= messageObj.messageType;
					//如果是系统信息
					if(messageType==that.messageApi.MSG_TYPE.SYSTEM_MSG){
						let content= messageObj.content;
						let sysMsgType= content.sysMsgType;
						//如果系统信息类型是修改群基本信息,这里要做本地群组列表的更新
						if(sysMsgType==that.messageApi.SYS_MSG_TYPE.updateGroupName||sysMsgType==that.messageApi.SYS_MSG_TYPE.updateGroupNotice){
							that.getChatGroupInfo(false);
						}
						//如果是撤回信息
						if(sysMsgType==that.messageApi.SYS_MSG_TYPE.revertMessage){
							console.log("撤回信息",content.param);
							if(content.param){
								let revertMsgId= content.param.id;
								that.messageList=that.messageList.filter(item=>item.id!==revertMsgId);
							}
						}
					}
					that.messageList.push(messageObj);
					that.$nextTick(function() {
						that.scrollIntoView = "msg_" + messageObj.id;
					});
				}
			},

			/*----------------------------------------------------（H5不支持）录音相关 start-------------------------------------- */
			//准备开始录音
			startVoice(e) {
				if (!this.Audio.paused) {
					//如果音频正在播放 先暂停。
					this.stopAudio(this.AudioExam)
				}
				this.recording = true;
				this.isStopVoice = false;
				this.voiceCanSend = true;
				this.voiceIconText = "正在录音..."
				this.PointY = e.touches[0].clientY;
				this.Recorder.start({
					format: 'mp3'
				});
			},
			//录音已经开始
			beginVoice() {
				let that = this;
				if (that.isStopVoice) {
					that.Recorder.stop();
					return;
				}
				that.voiceTitle = '松开 结束'
				that.voiceInterval = setInterval(() => {
					console.log("that.voiceTime", that.voiceTime);
					if (that.voiceTime > 49) {
						that.voiceIconText = "录音结束倒计时[" + (60 - that.voiceTime) + "]s";
					};
					if (that.voiceTime == 60) {
						clearInterval(that.voiceInterval);
						that.endVoice();
					}
					that.voiceTime++;
				}, 1000)
			},
			//move 正在录音中
			moveVoice(e) {
				const PointY = e.touches[0].clientY;
				const slideY = this.PointY - PointY;
				if (slideY > uni.upx2px(120)) {
					this.voiceCanSend = false;
					this.voiceIconText = '松开手指 取消发送 '
				} else if (slideY > uni.upx2px(60)) {
					this.voiceCanSend = true;
					this.voiceIconText = '手指上滑 取消发送 '
				} else {
					this.voiceIconText = '正在录音... '
				}
			},
			//结束录音
			endVoice() {
				this.isStopVoice = true; //加锁 确保已经结束录音并不会录制
				this.Recorder.stop();
				this.voiceTitle = '按住 说话'
			},
			//录音被打断
			cancelVoice(e) {
				console.log("路由被打断", e);
				this.voiceTime = 0;
				this.voiceTitle = '按住 说话';
				this.voiceCanSend = false;
				this.Recorder.stop();
			},
			//处理录音文件
			handleRecorder({
				tempFilePath,
				duration
			}) {
				if (this.voiceTime < 1) {
					this.voiceIconText = "说话时间过短";
					setTimeout(() => {
						this.recording = false;
					}, 500)
					return;
				}
				let contentDuration = this.voiceTime;
				this.voiceTime = 0;
				this.recording = false;
				clearInterval(this.voiceInterval);
				console.log("录音文件", tempFilePath);
				console.log("是否发送语音信息", this.voiceCanSend);
				let voiceFile = {
					tempFilePath: tempFilePath,
					contentDuration: Math.ceil(contentDuration),
					anmitionPlay: false,
				};
				if (this.voiceCanSend) {
					console.log("=====上传语音文件，并发送语音信息====");
					let audioType = this.messageApi.CONTENT_TYPE.AUDIO_CONTENT_TYPE;
					this.uploadFile(voiceFile, audioType);
					return;
				} else {
					console.log("=====已经取消发送语音信息====")
					return;
				}
			},
			//控制播放还是暂停音频文件
			handleAudio(item) {
				this.AudioExam = item;
				this.Audio.paused ? this.playAudio(item) : this.stopAudio(item);
			},
			//播放音频
			playAudio(item) {
				let target = item.content.fileSaveTarget;
				let src = item.content.fullPath;
				if (target == "local") {
					src = this.$u.api.multipartAddress.getFileByPath + src;
				}
				this.Audio.src = src;
				this.Audio.hasBeenSentId = item.id;
				this.Audio.play();
				let currentAudioMsg = this.messageList.find(it => it.id == item.id);
				currentAudioMsg.content.anmitionPlay = true;
			},
			//停止音频
			stopAudio(item) {
				let currentAudioMsg = this.messageList.find(it => it.id == item.id);
				currentAudioMsg.content.anmitionPlay = false;
				this.Audio.src = '';
				this.Audio.stop();
			},
			//关闭动画
			closeAnmition() {
				const hasBeenSentId = this.Audio.hasBeenSentId;
				let item = this.messageList.find(it => it.id == hasBeenSentId);
				item.content.anmitionPlay = false;
			},
			/*-------------------------------------录音相关方法块  end---------------------------------------------------*/
			formatNotice: function() {
					let that = this;
					let noticeStr = that.currentGroupDto.imGroup.groupNotice;
					noticeStr = noticeStr.replace(/\s+/g, ",");
					let noticeList= noticeStr.split(",");
					//console.log("noticeArr",noticeList);
					return noticeList;
			},
			closeAdvFlag: function() {
				let that = this;
				that.currentGroupDto.imGroup.showNoticeFlag=0;
				/* let param = {
					chatGroupId: that.currentChatGroup.id,
					hiddenFlag: 0
				}
				that.$u.api.chatGroup.updateMyChatGroupInfo(param).then(res => {
					if (res.code == 200) {
						console.log("关闭公告");
						that.currentChatGroup.advShowFlag = 0;
					} else {
						that.globalUtil.utilAlert("error");
						return;
					}
				}) */
			},
			//编辑确认
			submitEdit: function() {
				let that = this;
				that.editMsgPoPShow = false;
				let updateIndex = that.editMessage.msgIndex;
				that.messageList[updateIndex] = that.editMessage;
				console.log("修改后的信息", that.messageList[updateIndex]);
				that.messageApi.updateMessage(that.chatGroupId, that.editMessage, that);
			},

			//更新信息内容，红包转账领取或状态发生变化
			reloadMessage:function(messageItemId){
				let  that=this;
				//console.log("刷新数据",messageItemId);
				let groupType=that.currentGroupDto.imGroup.groupType;
				let param={msgId:messageItemId};
				this.$u.api.chatGroup.getTransferReceiveRecords(param).then(res => {
					if(res.code==200){
						let receiveUsers=res.data;
						if(receiveUsers&&receiveUsers.length>0){
							let oldMessageList=JSON.parse(JSON.stringify(that.messageList));
							oldMessageList.map((item,index)=>{
								if(messageItemId===item.id){
									 if(groupType==0){
									 	item.content.receiveAllFlag=true;
									 };
									 item.content.receiveUsers=receiveUsers;
									 that.$nextTick(function(){
										  that.messageList[index]=item;
										  that.$forceUpdate();
									 })
									// console.log("that.messageList[index]",that.messageList[index]);
									 return;
								}
							});
							return;
						}
					}
				}).catch(()=>{
					console.log("红包是否领取查询接口异常")
				})	
			},
			//打开修改信息的弹窗
			showUpdateMsgPop:function(editMessage,index){
				console.log("index",index);
				console.log("editMessage",editMessage);
				this.editMessage=editMessage;
				this.editMessage.msgIndex=index;
				this.editMsgPoPShow=true;
			},
			//撤回信息
			revertMsg:function(revertMessage,index){
				let that=this;
				let timestamp = new Date().getTime();
				let message = {
					"id": timestamp+"",
					"chatGroupId": that.chatGroupId,
					"userId": that.vuex_userInfo.id,
					"meFlag": true,
					"userName": that.vuex_userInfo.userName,
					"userAvatar": that.vuex_userInfo.avatar ? that.vuex_userInfo.avatar :
						"/static/image/default/default-user/default-user.png",
					'messageType': that.messageApi.MSG_TYPE.SYSTEM_MSG,
					"contentType":  that.messageApi.CONTENT_TYPE.TEXT_CONTENT_TYPE,
					"content": {
						'text':that.vuex_userInfo.userName+"撤回了一条信息",
						'sysMsgType':that.messageApi.SYS_MSG_TYPE.revertMessage,
						'param':revertMessage,
					},
					"createTime": that.globalUtil.getTimeStr(timestamp),
					"timestamp": timestamp,
					"platFrom": 1,
					"showTimeFlag": true,
				}
				console.log("撤回信息", message);
				this.globalWX.sendMessage(message, {
					complete: function(res) {
						if (res == true) {
							that.$u.api.chatGroup.revertMsg(revertMessage).then(res => {
							   console.log("撤回信息结果",res);
							})
						} else {
							that.globalUtil.utilAlert("网络故障，稍后重试！");
							return;
						}
					}
				},that.messageApi.BUSINESS_CODE.chatting);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.custom-navbar {
		width: 100%;
		display: flex;
		flex: 1;
		flex-direction: row;
		justify-content: space-between;
		align-content: center;
		align-items: center;
		padding: 0 30rpx;

		.nav-left {
			width:20%;
		}

		.nav-center {
			font-size: 36rpx;
			font-weight: bold;
			width: 60%;
		}

		.nav-right {
			width:20%;
		}
	}

	.msg-container {

		//width: 100%;
		.msg-box-scroller {
			::-webkit-scrollbar {
				display: none;
				height: 0;
				width: 0;
			}
		}
	}

	.footer-container {
		&-showfn{
			padding-bottom: 0rpx;
			padding-bottom: calc(420rpx + constant(safe-area-inset-bottom));
			padding-bottom: calc(420rpx + env(safe-area-inset-bottom) );
		}
		&-box {
			height: auto;
			min-height: calc(100vh - env(safe-area-inset-top) - 200rpx);
			box-sizing: content-box;
			position: relative;
			padding-bottom: 120rpx;
			
			/* #ifdef APP-PLUS  */
			padding-bottom: 0rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			/* #endif */
		}
		
		.input-box {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			box-sizing: content-box;
			z-index: 999;
			background-color: #f9f9f9 !important;
			
			/* #ifdef APP-PLUS */
			padding-bottom: 0rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			/* #endif */
		
			
			&-flex {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				flex-wrap: nowrap;
				flex-direction: row;
				padding: 20rpx;
				box-sizing: border-box;
				image{
					width: 60rpx;
					height: 60rpx;
				}
				.icon_img {
					margin-right: 20rpx;
				}
				.icon_btn_add{
					margin-left: 20rpx;
				}
				&-grow {
					flex-grow: 1;
			
					.content {
						box-sizing: border-box;
						background-color: #fff;
						height: 80rpx;
						padding: 0 20rpx;
						border-radius: 12rpx;
						font-size: 30rpx;
						caret-color: $uni-color-success;
					}
					
					
					.textArea-box {
						width: 100%;
						background-color: #FFFFFF;
						border-radius: 10upx;
						//padding-left: 30upx;
						min-height: 70upx;
						display: flex;
						align-items: center;
					
						textarea {
							width: 100%;
						}
					}
					
					.inputScroll {
						max-height: 180upx;
					}
					
					
			
					.voice_title {
						text-align: center;
						background-color: #ffffff;
						height: 80rpx;
						line-height: 80rpx;
						border-radius: 12rpx;
						font-weight: bold;
						font-size: 32rpx;
					}
				}
			
				.btn {
					margin-left: 20rpx;
					background-color: $u-type-success;
					border: none;
				}
			}
			
			.fun-box{
				opacity: 0;
				transition: all 0.1s ease-in-out;
				height: 0;
				.grid-text{
					padding-top: 10rpx;
					color: $uni-text-color-grey;
					font-size: 30rpx;
				}
				
			}
			.show-fun-box{
				opacity: 1;
				height: 400rpx;
				.emoji-swiper{
					height: 40vw;
					swiper-item{
						display: flex;
						align-content: flex-start;
						flex-wrap: wrap;
						view{
							width: 12vw;
							height: 12vw;
							display: flex;
							justify-content: center;
							align-items: center;
							image{
								width: 8.4vw;
								height: 8.4vw;
							}
						}
					}
				}
			}
		}
		/* 语音动画 */
		.voice_an {
			width: 300rpx;
			height: 300rpx;
			position: fixed;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -55%);
			background-color: rgba(41, 41, 41, 0.7);
			color: white;
			display: flex;
			flex-direction: column;
			align-items: center;
			text-align: center;
			border-radius: 10rpx;

			.text {
				padding-top: 30rpx;
			}

			@keyframes runVoice {
				0% {
					height: 10%;
				}

				20% {
					height: 50%;
				}

				50% {
					height: 100%;
				}

				80% {
					height: 50%;
				}

				100% {
					height: 0%;
				}
			}

			.wave {
				width: 6rpx;
				height: 100%;
				margin-left: 10rpx;
				border-radius: 50rpx;
				background-color: #999;
				vertical-align: middle;
				display: inline-block;
			}

			.voice_an_icon {
				width: 200rpx;
				height: 100rpx;
				line-height: 50rpx;
				margin: 50rpx 0;
			}

			.voice_an_icon #one {
				animation: runVoice 0.6s infinite 0.1s;
			}

			.voice_an_icon #two {
				animation: runVoice 0.6s infinite 0.3s;
			}

			.voice_an_icon #three {
				animation: runVoice 0.6s infinite 0.6s;
			}

			.voice_an_icon #four {
				animation: runVoice 0.6s infinite 0.1s;
			}

			.voice_an_icon #five {
				animation: runVoice 0.6s infinite 0.3s;
			}

			.voice_an_icon #six {
				animation: runVoice 0.6s infinite 0.6s;
			}

			.voice_an_icon #seven {
				animation: runVoice 0.6s infinite 0.1s;
			}
		}
	}
</style>
<style>
	page {
		background-color: #F8F8F8;
	}
</style>